<template>
	<view class="page">
		<view class="top">
			<view class="vipBanner" :style="{ 'background-image': 'url(' + $getImgUrl(vipBanner) + ')'}">
				
			</view>
			<view class="vipText">
				您还没有开通<text class="vipTextBlod">VIP</text>特权
			</view>
		</view>
		<view class="body">
			<view class="vipInfoList">
				
				<view class="vipInfoItem" v-for="(vipItem, index) in vipInfoList" :key="vipItem.ID">
					<view class="vipInfoItemContent">{{ vipItem.Title }}<text>/ {{ vipItem.Day }}天</text>
					</view>
					<view class="vipInfoItemTransaction">
						<view class="vipInfoItemPrice">￥<text class="vipInfoItemPriceText">{{ VipPriceFormat(vipItem.Price) }}</text></view>
						<view class="VipInfoItemBayButtom" @click="openVipVipw(vipItem.ID)">立即开通</view>
					</view>
				</view>
			</view>
		</view>
		<view class="bottom">
			<BackHome></BackHome>
		</view>
	</view>
</template>

<script>
	import { moneyFormat } from '../../common/common.js';
	import BackHome from '@/components/FloatButton/BackHome.vue';
	export default {
		data() {
			return {
				vipBanner:'',
				vipInfoList:[],
			}
		},
		onLoad() {
			this.getUserVIPRegList()
		},
		methods: {
			getUserVIPRegList(){
				this.$api.getUserVIPRegList().then(res => {
					console.log(res.data)
					this.vipBanner = res.data.VIPPic
					this.vipInfoList = res.data.VIPList
				})
			},
			VipPriceFormat(price) {
				return moneyFormat(price, 2);
			},
			openVipVipw(id){
				uni.navigateTo({
					url:'../regView/regView?id=' + id
				})
			}
		},
		computed: {
		},
		components: {
			BackHome
		},
	}
</script>

<style scoped>
@import url('reg.css');
</style>
